<template>
	<div >
		<ul>
			<li v-for='item in numbers'>{{item.name}}</li>
		</ul>
		<button @click='btnClick'>发请求</button>
	</div>
</template>

<script>
	/*
		axios的请求函数会返回一个promise对象，通过.then添加回调函数
		和jQuery不同，请求成功的回调函数是整个响应报文，而不是响应体，通过res.data可以得到响应体。
	*/
	export default{
		data:function(){
			return {
				numbers:[]
			}
		},
		/*
			在vue项目中，可以通过设置代理服务器实现跨域请求，在config文件夹汇总的index.js文件中设置代理列表
		*/
		methods:{
			btnClick:function(){
				var url = '/douyu/api/RoomApi/room'
				this.$axios.get(url)
				.then(function(res){
					console.dir(res.data)
				})
			}
		},
		activated:function(){
			// console.log('页面被激活了')
			this.$axios.get('/static/data.json')
			.then(function(res){
				console.log('请求成功了')
				this.numbers = res.data.result
			}.bind(this),function(){
				console.log('请求失败')
			})
		},
		mounted:function(){
			// console.log('发起请求了')
		}
	}
</script>

<style>
	
</style>